/**
 * @description: 列表组件数组处理 mixin, 所有的数据处理逻辑在这
 */
//调试数据
/* stylelint-disable */
// import { getSettingConfigs, setSettingConfigs } from '@winner/shared/logic/holdController.js';
export default {
  props: {
    // 持仓数据模型，包含字段 keys、rows、style、subSystemNo、functionId, 支持异常数据
    listRes: {
      type: Object,
      default() {
        return {};
      }
    },
    // 是否是持仓组件(持仓组件会自动读取当前排序的字段，与原生同一个交易类型保持相同字段的排序)
    isHoldList: {
      type: Boolean,
      default() {
        return false;
      }
    },
    // 底部更多菜单,传入则展示否则不展示，默认为空
    menuList: {
      type: Array,
      default() {
        return []// 通用持仓底部要点击的需要传入['买入', '卖出', '详情', '行情'];
      }
    },
    // 单行点击事件，返回行内数据
    rowClick: {
      type: Function,
      default() {
        return () => {};
      }
    },
    // 底部菜单点击事件（返回行数据，菜单名称，功能下标）
    menuClick: {
      type: Function,
      default() {
        return () => {};
      }
    },
    // 列表高度
    listHeight: {
      type: Number,
      default() {
        return 660;
      }
    },

    // 支持排序的字段
    sortKeys: {
      type: Array,
      default() {
        return ['market_value', 'current_amount', 'cost_price', 'income_balance'];
      }
    },
    // 默认的排序字段
    defaultSortKey: {
      type: String,
      default() {
        return 'market_value';
      }
    },
    //支持涨跌色的字段数组  
    colorKeyArray: {
      type: Array,
      default() {
        return ['income_balance', 'income_balance_ratio'];
      }
    },
    // 支持买卖色的key数组
    colorBuySellArray: {
      type: Array,
      default() {
        return ['entrust_bs'];
      }
    },
    // 默认的排序状态ascending/descending  不传代表空则不排序
    defaultSortStatus: {
      type: String,
      default() {
        return 'descending';
      }
    },
    loading: { // 列表加载状态
      type: Boolean,
      default() {
        return true;
      }
    },
    miniList: { // 是否是小列表，小列表无数据占位图及无网络图小一些
      type: Boolean,
      default() {
        return  false;
      }
    },
    
    // 无数据占位提示文字
    noDataStr: {
      type: String,
      default() {
        return '暂无数据';
      }
    },
    // 交易类型，默认普通交易 1:普通交易，3：两融交易，4：期权交易
    tradeType: {
      type: String,
      default() {
        return '1';
      }
    },
  },
  data() {
    return {
      showKeysMap: {}, // 处理后展示的 keys 和 names 的映射关系
      columStyle: [], // 列表单行或者双行的样式数组[2,2,2,2],不存在则按每列2，开始往后排列完所有的 key
      showKeys: [], // 处理后展示的 keys
      columKeyArrs: [], // 二维数组列表，存储每一列对应的 key数组
      columnNames: [], // 把每一列需要展示的名称组成一个字符串放到数组中，如果是俩字段名称则用斜线分割
      tableDataRes: [], // 表格展示的数据（包含功能号 style ,rows等）
      tableOriginList: [], // 接口返回的原始数据,列表数据(去除表头)
      tableStartInit:false, // 是否开始初始化完成
      currentSortStatus: '', // 当前排序状态
      currentSortKey: '',
      loadingStatus: this.loading, 
      noDataStatus: false, // 列表无数据状态
      showNoNet:false, //是否展示无网络提示
      configInfo: { //普通、两融、期权对应的排序 key 及 排序状态
        stock_position_order_field: '',
        stock_position_order_status: '',
        margin_position_order_field: '',
        margin_position_order_status: '',
        option_position_order_field: '',
        option_position_order_status: ''
      },
    };
  },
  computed: {
   
  },
  watch: {
    listRes: {
      deep: true, // 数组及对象要深度watch
      immediate: true, // 立即执行一次
      handler(newVal) {
        console.log('listRes changed', newVal);
        this.initCommonShowData();
      },
    }
  },
  mounted(){
    this.initSorKeyAndStatus(); // 初始化排序字段和状态
    console.log('listDataVM mounted',this.listRes);
  },
  created(){},

  methods: {

    /**
     * @description: 处理展示的 keys 和 names
     */
     initCommonShowData() {
      // 判断无网络状况下做无网提示
      if(this.listRes && this.listRes.error && this.listRes.error.error_code == 202) {
        console.log('hold list no net');
        this.noDataStatus = true;
        this.showNoNet = true;
      } else {
        this.showNoNet = false;
      }

      if (!this.listRes || !this.listRes.rows || this.listRes.rows.length <= 0) {
        this.showKeys = [];
        return;
      }

      this.tableOriginList = this.listRes.rows.slice(2); // 保存原始数据


      const keys = this.listRes.keys; // 假设这是一个包含键名的数组
      const shortNameModel = this.listRes.rows[1]; // 假设这是一个对象，包含键值对

      this.showKeysMap = shortNameModel; // 直接将 shortNameModel 赋值给 showKeysMap

      // 初始化两个数组，用于存储结果
      let nonEmptyKeys = [];
      let nonEmptyValues = [];

      // 遍历 keys 数组
      keys.forEach((key) => {
        const value = shortNameModel[key]; // 获取对应的值
        if (value !== null && value !== undefined && value !== '') {
          // 检查值是否不为空
          nonEmptyKeys.push(key); // 将键添加到 nonEmptyKeys 数组
          nonEmptyValues.push(value); // 将值添加到 nonEmptyValues 数组
        }
      });

      // 处理样式数组
      const count = Math.floor(nonEmptyValues.length / 2);
      let styleArray = this.listRes.style;
      if (!styleArray || styleArray.length <= 0) {
        styleArray = Array.from({ length: count }, () => '2');
        if (nonEmptyValues.length % 2 > 0) {
          styleArray.push('1');
        }
      }
      this.columStyle = styleArray;

      // 计算需要展示的字段总和
      let sum = this.columStyle.reduce((accumulator, currentValue) => {
        // 将当前值转换为整数并累加
        return accumulator + parseInt(currentValue, 10);
      }, 0);

      // 如果非空值的数量大于 sum，则截取前 sum 个元素
      if (nonEmptyValues.length > sum) {
        nonEmptyKeys = nonEmptyKeys.slice(0, sum);
        nonEmptyValues = nonEmptyValues.slice(0, sum);
      }
      this.showKeys = nonEmptyKeys;

      // 处理 columKeyArrs, 用于每一列展示
      this.columKeyArrs = this.generateColumKeyArrs(nonEmptyKeys, styleArray);
      this.columnNames = this.generateColumNameArrs(nonEmptyValues, styleArray);

      this.columWidth = this.columKeyArrs.map((item, index) => {
        return this.columWidthWithIndex(index);
      });

      this.tableStartInit = true; // 开始初始化


      this.initSortListAfterData();  

    },

    /**
     * 持仓列表需要初始化排序相关的数据
     */
    async initSorKeyAndStatus(){
      // if(this.isHoldList) { // 如果是持仓列表则需要读取当前排序的字段
      //   this.configInfo = await getSettingConfigs(this.configInfo);
      //   let configSortStatus = ''
      //   if(this.tradeType == '1') {//ascending/descending
      //     this.currentSortKey = this.configInfo.stock_position_order_field;
      //     configSortStatus = this.configInfo.stock_position_order_status;
      //   } else if(this.tradeType == '3') {
      //     this.currentSortKey = this.configInfo.margin_position_order_field;
      //     configSortStatus = this.configInfo.margin_position_order_status;
      //   } else if(this.tradeType == '4') {
      //     this.currentSortKey = this.configInfo.option_position_order_field;
      //     configSortStatus = this.configInfo.option_position_order_status;
      //   } 
      //   this.currentSortStatus = configSortStatus == '0' ? 'ascending' : 'descending';
      // }
    },

    /**
     * 把当前排序的字段和状态保存到本地
     */
    setHoldSortKeyAndStatusToLocal() {
      // if(this.isHoldList) { // 如果是持仓列表则需要读取当前排序的字段
      //   if(this.tradeType == '1') {//ascending/descending
      //     this.configInfo.stock_position_order_field = this.currentSortKey;
      //     this.configInfo.stock_position_order_status = this.currentSortStatus == 'ascending' ? '0' : '1';
      //   } else if(this.tradeType == '3') {
      //     this.configInfo.margin_position_order_field = this.currentSortKey;
      //     this.configInfo.margin_position_order_status = this.currentSortStatus == 'ascending' ? '0' : '1';
      //   } else if(this.tradeType == '4') {
      //     this.configInfo.option_position_order_field = this.currentSortKey;
      //     this.configInfo.option_position_order_status = this.currentSortStatus == 'ascending' ? '0' : '1';
      //   } 
      //   setSettingConfigs(this.configInfo);
      // }
    },

     /**
     * @description: 初始化列表排序数据
     * @param {Array} listData 列表数据
     */
    initSortListAfterData() {
      // 初始化列表数据
      this.tableDataRes = [...this.tableOriginList];

      // 处理默认排序状态
      this.sortHandler(this.currentSortKey, this.currentSortStatus);
      this.loadingStatus = false; // 停止加载状态      

      this.noDataStatus = this.tableDataRes && this.tableDataRes.length <= 0; // 判断列表是否有数据
   },

    /**
     * 根据展示的 keys 和样式数组生成每列展示的name数组
     * @param {*} showKeys
     * @param {*} columStyle
     * @returns
     */
    generateColumNameArrs(showKeys, columStyle) {
      let tempArray = [];
      let startIndex = 0; // 用于跟踪从 showKeys 中开始获取字段的索引

      columStyle.forEach((count) => {
        // 获取 每列展示的字段 count 确保是一个整数，最多不超过 2
        const numFields = parseInt(count, 10) > 1 ? 2 : 1;

        let columNameArr = [];
        for (let i = 0; i < numFields; i++) {
          if (startIndex < showKeys.length) {
            columNameArr.push(showKeys[startIndex]);
            startIndex++;
          } else {
            // 如果 showKeys 中的字段用完了，可以根据需求决定是否继续或抛出错误
            // 这里我们假设不会超出 showKeys 的长度，因为逻辑上 columStyle 应该合理设置
            break;
          }
        }

        // 如果每列有俩名字则用斜线分割
        const columName = columNameArr.length > 1 ? columNameArr.join('/') : columNameArr[0];

        tempArray.push(columName);
      });

      return tempArray;
    },

    /**
     * 根据展示的 keys 和样式数组生成二维数组
     * @param {*} showKeys
     * @param {*} columStyle
     * @returns
     */
    generateColumKeyArrs(showKeys, columStyle) {
      let tempArray = [];
      let startIndex = 0; // 用于跟踪从 showKeys 中开始获取字段的索引

      columStyle.forEach((count) => {
        // 获取 每列展示的字段 count 确保是一个整数，最多不超过 2
        const numFields = parseInt(count, 10) > 1 ? 2 : 1;

        let columKeys = [];
        for (let i = 0; i < numFields; i++) {
          if (startIndex < showKeys.length) {
            columKeys.push(showKeys[startIndex]);
            startIndex++;
          } else {
            // 如果 showKeys 中的字段用完了，可以根据需求决定是否继续或抛出错误
            // 这里我们假设不会超出 showKeys 的长度，因为逻辑上 columStyle 应该合理设置
            break;
          }
        }

        tempArray.push(columKeys);
      });

      return tempArray;
    },

    // 排序处理
    sortHandler(sortBy, sortOrder) {

      // 如果当前传入排序字段不存在，则不进行排序
      if(this.showKeys.length <= 0 || this.showKeys.indexOf(sortBy) == -1) {
        console.log('当前列不支持排序');
        return;
      }

      this.currentSortStatus = sortOrder;
      this.currentSortKey = sortBy;
      if (!sortOrder) {
        this.tableDataRes = [...this.tableOriginList];
        return;
      }
      this.tableDataRes.sort((a, b) => {
        if (sortOrder === 'ascending') {
          return a[sortBy] - b[sortBy];
        } else if (sortOrder === 'descending') {
          return b[sortBy] - a[sortBy];
        }
        return true;
      });
      this.setHoldSortKeyAndStatusToLocal(); // 设置排序字段和状态到本地
    },

    /**
     * 校验当前列是否支持排序
     * @param {*} keys 当前列对应的 key
     */
    checkSupportSort(keys) {
      if (!keys || keys.length <= 0) {
        return false;
      }
      // 判断当前列是否支持排序
      const isSupportSort = this.sortKeys.some((key) => keys.includes(key));
      return isSupportSort ? 'custom' : false;
    },

    /**
     * 获取当前列的排序字段
     * @param {*} keys 当前列对应的 key
     */
    chooseSupportSortKey(keys) {
      if (!keys || keys.length <= 0) {
        return '';
      }
      // 使用Set提高查找效率
      const keysSet = new Set(keys);
      // 遍历sortKeys数组查找第一个匹配项
      for (const key of this.sortKeys) {
          if (keysSet.has(key)) {
              return key;
          }
      }
      // 如果没有找到匹配项，返回null
      return '';
    },

    /**
     * 判断当前 key 是否应该显示排序状态颜色
     * @param {*} key 当前列对应的 key
     */
    shouldHilightColorWith(key) {
      if (!key || key.length <= 0) {
        return false;
      }
      // 判断当前列是否支持排序
      const isSupportSort = this.currentSortKey == key;
      return isSupportSort && this.currentSortStatus && this.currentSortStatus.length > 0
    },

    /**
     * 格式化字段值
     * @param {*} key 
     * @param {*} value 
     * @returns 
     */
    formatItemValue(key, value) {
      if(!value || value.length <= 0 || value == '--' || value == '-') {
        return '--';
      }

      if (key == 'income_balance_ratio') {
        return `${value}%`; // 如果是 income_balance_ratio，则在值后拼接 %
      }
      return value; // 其他情况直接返回值
    },


    /**
     * 校验字段应该展示的颜色，涨,跌,买,卖
     * @param {*} key 
     * @param {*} value 
     * @returns 
     */
     checkShowSpecialColorClass(key, value) {

      // 'value-text-up': colorKeyArray.includes(keys[0]) && slotProps.row[keys[0]] > 0,
      // 'value-text-down': colorKeyArray.includes(keys[0]) && slotProps.row[keys[0]] < 0

      // 如果字段或者 value 为空，则不展特殊样式
      if(!key || key.length <= 0 || !value || value.length <=0 || value == '--' || value == '-' ) {
        return '';
      }

      // 判断当前字段是否在 colorKeyArray 中，进行买卖色匹配
      if(this.colorKeyArray.includes(key)) {
        if (value > 0) {
          return 'value-text-up'; // 涨
        } else if (value < 0) {
          return 'value-text-down'; // 跌
        }
      } else if (this.colorBuySellArray.includes(key)) {
        if (value.indexOf('买') > -1) {
          return 'value-text-buy'; // 买
        } else {
          return 'value-text-sell'; // 卖
        }
      }
      return ''; // 其他情况直接返回值
    },





  },
  beforeDestroy() {},
  destroyed() {}
};
